<!--
 * @Author: zhangmengqiong
 * @Date: 2021-05-10 17:43:06
 * @LastEditors: zhangmengqiong
 * @LastEditTime: 2021-05-11 15:16:00
-->
<template>
  <div class="top-view">
    <el-row :gutter="20">
      <el-col :span="6">
        <el-card shadow="hover">
          <total-sales />
        </el-card>
      </el-col>
      <el-col :span="6">
        <el-card shadow="hover">
          <total-orders />
        </el-card>
      </el-col>
      <el-col :span="6">
        <el-card shadow="hover">
          <today-user />
        </el-card>
      </el-col>
      <el-col :span="6">
        <el-card shadow="hover">
          <total-users />
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: "TopView",
  props: {
    msg: String
  },
  components: {
    TotalSales: () => import("./component/TotalSales"),
    TotalOrders: () => import("./component/TotalOrders"),
    TotalUsers: () => import("./component/TotalUsers"),
    TodayUser: () => import("./component/TodayUser")
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss"></style>
